<template>
    <div>
        <my-loading-overlay :loading-overlay="loadingOverlay"></my-loading-overlay>
        <my-button-frame>
            <div class="d-inline-block mr-2">
                <v-btn :disabled="disabled" outlined color="success" height="40px" @click="revert()">
                    还原
                </v-btn>
            </div>
            <div class="d-inline-block">
                <v-btn :disabled="disabled" outlined color="primary" height="40px" @click="deleteDialog = true">
                    彻底删除
                </v-btn>
            </div>
        </my-button-frame>
        <my-info-bar type="recycle" :length="recycleList.length"></my-info-bar>
        <my-recycle-table :recycle-list="recycleList"></my-recycle-table>
        <my-exists-dialog @close="closeExistDialog()" :exists-dialog="existDialog" :exists-list="failList"></my-exists-dialog>
        <v-dialog
                v-model="deleteDialog"
                persistent
                overlay-opacity="0.2"
                max-width="460px"
        >
            <v-card outlined>
                <my-loading-overlay :loading-overlay="loadingOverlay"></my-loading-overlay>
                <v-card-title class="subtitle-1" style="border-bottom: 1px solid #d0dfe7">彻底删除</v-card-title>
                <v-card-text class="text-center mt-4">
                    文件删除后将无法恢复，您确认要彻底删除所选文件吗？
                </v-card-text>
                <v-card-actions>
                    <v-btn class="ml-10" width="160" color="primary" @click="deleteRecycle()">确认</v-btn>
                    <v-btn class="ml-10" width="160" color="warning" @click="deleteDialog = false">取消</v-btn>
                </v-card-actions>
            </v-card>
        </v-dialog>
    </div>
</template>

0<script>
    import MyButtonFrame from "../common/MyButtonFrame";
    import MyRecycleTable from "./MyRecycleTable";
    import MyLoadingOverlay from "../common/MyLoadingOverlay";
    import MyInfoBar from "../common/MyInfoBar";
    import MyExistsDialog from "../common/MyExistsDialog";
    import {getCapacity} from "../../../util";

    export default {
        name: "Recycle",
        components: {
            MyExistsDialog,
            MyInfoBar, MyLoadingOverlay, MyRecycleTable, MyButtonFrame},
        created() {
            this.getRecycleList();
        },
        beforeDestroy() {
            this.selected = [];
        },
        data() {
            return {
                recycleList: [],
                loadingOverlay: false,
                failList: [],
                existDialog: false,
                deleteDialog: false
            }
        },
        methods:  {
            getCapacity,
            getRecycleList() {
                let _this = this;
                _this.loadingOverlay = true;
                _this._get({
                    url: 'system/disk/get-recycle-list'
                }).then(rsp => {
                    _this.recycleList = rsp.data;
                }).catch(error => {
                    console.log(error);
                    _this.$serverError();
                }).finally(() => {
                    _this.loadingOverlay = false;
                })
            },
            revert() {
                let _this = this;
                _this.loadingOverlay = true;
                _this._put({
                    url: 'system/disk/revert-file',
                    data: _this.selected
                }).then(rsp => {
                    _this.selected = [];
                    _this.getRecycleList();
                    _this.getCapacity();
                    if (rsp.data.code !== '00000') {
                       _this.failList = rsp.data.object;
                       _this.existDialog = true;
                    }
                }).catch(error => {
                    console.log(error)
                    _this.$serverError();
                }).finally(() => {
                    _this.loadingOverlay = false
                })
            },
            deleteRecycle() {
                let _this = this;
                _this.loadingOverlay = true;
                let ridList = [];
                for (const item of _this.selected) {
                    ridList.push(item.id);
                }
                _this._delete({
                    url: 'system/disk/delete-recycle',
                    data: ridList
                }).then(rsp => {
                    _this.selected = [];
                    _this.deleteDialog = false;
                    this.getRecycleList();
                }).catch(error => {
                    console.log(error);
                    _this.$serverError();
                }).finally(() => {
                    _this.loadingOverlay = false;
                })

            },
            closeExistDialog() {
                this.existDialog = false;
                this.failList = []
            }
        },
        computed: {
            selected: {
                get() {
                    return this.$store.state.selected;
                },
                set(value) {
                    this.$store.commit('setSelected', value);
                }
            },
            disabled() {
                return this.$store.state.selected.length === 0;
            }
        }
    }
</script>

<style scoped>

</style>